<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix='sec' uri='http://www.springframework.org/security/tags'%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
	<script type="text/javascript" src="scripts/boot.js"></script>
</head>
<body style="border: 0px; margin: 0px; padding: 0px;width: 100%;height: 100%">
	<input class="mini-hidden" id="extension" value="<s:property value='extension'/>"/>
	<div class="mini-fit" >
	<div id="datagrid1" class="mini-datagrid" idField="id" showPager="false" style="width:100%;height:100%;" multiSelect="true">
		<div property="columns">
			<div type="indexcolumn"></div>
			<div type="checkcolumn"></div>
			<div field="extension" width="12%" headerAlign="center" align="center">分机号</div>
			<div field="queue" width="25%" headerAlign="center" align="center">所在队列</div>
			<div field="jobNum" width="12%" headerAlign="center" align="center">坐席</div>
			<div field="extensionState" width="20%" headerAlign="center" align="center">状态</div>
			<div field="caller" width="12%" headerAlign="center" align="center">呼入数/时长</div>
			<div field="exhale" width="12%" headerAlign="center" align="center">呼出数/时长</div>
			<div field="duration" width="15%" headerAlign="center" align="center">距上次通话</div>
			<div name="action" width="19%" headerAlign="center" align="center" renderer="onActionRenderer" >相关操作</div>
		</div>
	</div>
	</div>
<script type="text/javascript">
	mini.parse();
	
	var grid = mini.get("datagrid1");

/*连接WebSocket*/
    jQuery.openWebSocket("ws://172.16.2.11:8080/websocket");
    
    
// 连接成功时执行
	var extension = mini.get("extension").getValue();
    function webSocketOnOpen(event) {
		jQuery.showPeers(extension);
 	}
    
// 接收软交换返回数据
	function webSocketOnMessage(event) {
		var data = $.evalJSON(event.data);
		
		switch (data.Event) {
		case "ShowPeers":
			var datas = [];
			data.Extens.forEach(function(obj) {
				$.post("alternately_extension_call.do", {extension: obj.objectName}, function(data) {
					var eObj = {};
					
					// 分机号
	 				eObj.extension = obj.objectName;
					
					// 所在队列
	 				var queues = new Array;
	 				$.each(obj.deviceQueue, function(queue, state) {		
	 					queues.push(queue);
	 				});
	 				queues.join(",");
	 				eObj.queue = queues;
	 				
	 				// 坐席
	 				eObj.jobNum = data.jobNum;
	 				
					// 状态
 					if(jQuery.isEmptyObject(obj.deviceQueue)) {
 						if(obj.deviceState == "HangUp" || "" == obj.deviceState) {
 							eObj.extensionState = "noCheckIn";									// 未签入
 						} else if(obj.deviceState == "Bridge") {
 							eObj.extensionState = "noCheckInBridge";							// 未签入通话
 						} else if(obj.deviceState == "Ring") {
 							eObj.extensionState = "noCheckInRing";								// 未签入响铃
 						}
 					} else {
 						for(var queue in obj.deviceQueue) {
 		 					if(obj.deviceQueue[queue] == "1" && obj.deviceState == "HangUp") {
 		 						eObj.extensionState = "locked";									// 锁机
 		 					} else if(obj.deviceQueue[queue] == "1" && obj.deviceState == "Bridge") {
 		 						eObj.extensionState = "lockedBridge";							// 锁机通话
 		 					} else if(obj.deviceQueue[queue] == "1" && obj.deviceState == "Ring") {
 		 						eObj.extensionState = "lockedRing";								// 锁机响铃
 		 					} else if(obj.deviceQueue[queue] == "0" && obj.deviceState == "HangUp") {
 		 						eObj.extensionState = "normal";									// 正常
 		 					} else if(obj.deviceQueue[queue] == "0" && obj.deviceState == "Bridge") {
 		 						eObj.extensionState = "normalBridge";							// 正常通话
 		 					} else if(obj.deviceQueue[queue] == "0" && obj.deviceState == "Ring") {
 		 						eObj.extensionState = "normalRing";								// 正常响铃
 		 					} else if(obj.deviceQueue[queue] == "0" && obj.deviceState == "") {
 		 						eObj.extensionState = "normal";								// 正常响铃
 		 					}
 		 				}
 					}
	 				
					// 距上次通话
	 				if(obj.hangupTime != -1) {
	 					var now = new Date();								// 当前时间
	 					var hangupTime = new Date(obj.hangupTime);			// 挂断时间
						
	 					// 相差天数
	 					var jetLag = now.getTime() - hangupTime.getTime();	// 时差毫秒数
	 					var days = Math.floor(jetLag/(24*3600*1000));		
						
	 					// 相差小时数
	 					var leave1 = jetLag % (24*3600*1000)    			// 计算天数后剩余的毫秒数
	 					var hours = Math.floor(leave1/(3600*1000))			
						
	 					// 相差分钟数
	 					var leave2 = leave1 % (3600*1000)        			// 计算小时数后剩余的毫秒数
	 					var minutes = Math.floor(leave2/(60*1000))			
						
	 					// 计算相差秒数
	 					var leave3 = leave2 % (60*1000)      				// 计算分钟数后剩余的毫秒数
	 					var seconds = Math.round(leave3/1000)
						
	 					eObj.duration = days + "天" + hours + "小时" + minutes + "分钟" + seconds + "秒";
	 				}
					
	 				// 呼入数/时长		// 呼出数/时长
					eObj.caller = data.callerCount + "个 / " + data.callLength + "秒";
					eObj.exhale = data.exhale + "个 / " + data.callDuration + "秒";
					
					datas.push(eObj);
					grid.setData(datas);
				}, "json");
			});
			
			break;
		case "chanSpy":
			if(data.chanSpy == "succ") {
				
			} else {
				mini.alert("监听失败！");
			}
			break;
		}
	}
	
	// 替换分机状态图标
	grid.on("drawcell", function(e) {
		column = e.column;
		
		//将分机状态替换成图片
        if (column.field == "extensionState") {
            if (e.value == "locked") {
                e.cellHtml = "<span class='locked' style='display: block;'></span>"
            } else if(e.value == "lockedBridge") {
                e.cellHtml = "<span class='locked-bridge' style='display: block;' ></span>"
            } else if(e.value == "lockedRing") {
                e.cellHtml = "<span class='locked-ring' style='display: block;' ></span>"
            } else if(e.value == "normal") {
                e.cellHtml = "<span class='normal' style='display: block;' ></span>"
            } else if(e.value == "normalBridge") {
                e.cellHtml = "<span class='normal-bridge' style='display: block;' ></span>"
            } else if(e.value == "normalRing") {
                e.cellHtml = "<span class='normal-ring' style='display: block;' ></span>"
            } else if(e.value == "noCheckIn") {
                e.cellHtml = "<span class='no-check-in' style='display: block;' ></span>"
            } else if(e.value == "noCheckInBridge") {
                e.cellHtml = "<span class='no-check-in-bridge' style='display: block;' ></span>"
            } else if(e.value == "noCheckInRing") {
                e.cellHtml = "<span class='no-check-in-ring' style='display: block;' ></span>"
            }
        }
		
	});
	
	//相关操作
	function onActionRenderer(e) {
		return '<a href="javascript: monitor()">监听</a>';
	}
	
	// 监听
	function monitor() {
		var row = grid.getSelected();
		$.post("alternately_cur_extension.do", function(data) {
			if(data.phoneNum.length > 0) {
				jQuery.chanSpy(data.phoneNum, row.extension);
			} else {
				mini.alert("请先登录分机！");
			}
		}, "json");
	}
    
</script>
</body>
</html>